<template>
 <div>
  御剑乘风来,除魔天地间!
  <ul>
    <li><router-link to="/first/打何翔?id=1&name=周亮666">我是第1个li</router-link></li>
    <li><router-link to="/second?id=2">我是第2个li</router-link></li>
    <li><router-link to="/third?id=3">我是第3个li</router-link></li>
  </ul>
  <router-view></router-view>
 </div>
</template>
<script>
export default{
    name:'',
    data () {
        return {
            
        }
    },
    created () {
    },
    computed:{
    },
    methods:{
    }
}
</script>
<style lang='less'  scoped>
// 每个router-link有两个默认类名给router-link-exact-active加上背景颜色就会有点击高亮效果,也可以说是精准匹配
//另一个router-link-active则为模糊匹配
.router-link-exact-active{
  background-color: red;
}
    ul{
      display: flex;
      li{
        margin: 0 20px;
      }
    }
</style>
